<template>
  <div>
    <el-button type="primary" @click="savePermission()">分配权限</el-button>
    <el-tree
      :data="permissionList"
      show-checkbox
      check-strictly="true"
      node-key="id"
      ref="tree"
      :default-expanded-keys="[2, 3]"
      :default-checked-keys="defaultChecked"
      :props="defaultProps"
    >
    </el-tree>
    <div>{{ rid }}</div>
  </div>
</template>
  
  <script>
export default {
  data() {
    return {
      rid: 0,
      permissionList: [],
      defaultChecked: [],
      defaultProps: {
        children: "children",
        label: "label",
      },
    };
  },
  methods: {
    loadPermission() {
      this.rid = this.$route.query.rid;
      this.$axios.get("permissions/" + this.rid).then((res) => {
        this.permissionList = res.data.data.permissionList;
        this.defaultChecked = res.data.data.defaultChecked;
      });
    },
    savePermission() {
      this.$axios
        .post("/permissions", {
          rid: this.rid,
          pids: this.$refs.tree.getCheckedKeys(),
        })
        .then((res) => {
          this.$message.success("权限分配成功，重新登录以启用新权限");
          
          this.$router.push("/");
        });
    },
  },
  mounted() {
    this.loadPermission();
  },
};
</script>